<template>
  <div class="adminSet">
    <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="120px" class="demo-ruleForm">
      <el-button @click="goback()" size="mini" type="primary" style="    position: absolute;
    right: 6px;
    top: 6px;">返回</el-button>

      <el-form-item label="活动名称：" prop="activityName">
        <el-input v-model="ruleForm.activityName" :disabled="disabledFlag"></el-input>
      </el-form-item>

      <el-form-item label="活动时间：" prop="time">
        <el-date-picker v-model="value4" type="daterange" align="right" unlink-panels range-separator="至"
          start-placeholder="开始日期" end-placeholder="结束日期" :disabled="flag3" value-format="yyyy-MM-dd" @change="gaibianzhi"
          :picker-options="pickerOptions2">
        </el-date-picker>
      </el-form-item>

      <el-form-item label="满赠活动金额：" prop="limitMoney">
        <el-input type="number" min="0" v-model="ruleForm.limitMoney" :disabled="flag3" style="width:180px; text-align-last:left;"></el-input>
        元
      </el-form-item>

      <el-form-item label="概率系数：" prop="limitRate">
        <el-input type="number" min="0" v-model="ruleForm.limitRate" :disabled="flag3" style="width:180px; text-align-last:left;"></el-input>
      </el-form-item>


      <el-form-item label="活动规则：" prop="activityDesc">
        <el-input type="textarea" autosize v-model="ruleForm.activityDesc" :disabled="flag3"></el-input>
      </el-form-item>

      <el-form-item label="发布状态：">
        <el-radio-group v-model="ruleForm.status" :disabled="flag3">
          <el-radio-button label="0">不发布</el-radio-button>
          <el-radio-button label="1">发布</el-radio-button>
        </el-radio-group>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" @click="submitForm('ruleForm')" size="mini" v-if="!flag3">保 存</el-button>
        <!-- <el-button @click="goback()" size="mini" type="primary">返回</el-button> -->
        <el-button @click="resetForm('ruleForm')" size="mini" type="primary" v-if="!flag3">取 消</el-button>
      </el-form-item>
    </el-form>

  </div>
</template>

<script>
  import {
    addNewYearActivity
  } from "@/api/newYearActive";
  export default {
    data() {
      return {
        pickerOptions2: {
          shortcuts: [{
            text: '最近一周',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '最近一个月',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '最近三个月',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit('pick', [start, end]);
            }
          }]
        },
        ruleForm: {
          activityName: "",
          limitMoney: 0,
          activityDesc: "",
          limitRate:1,
          status: 0,
        },
        value4: [],
        rules: {
          activityName: [{
            required: true,
            message: "请输入活动名称",
            trigger: "blur"
          }],
          /* time: [{ required: true, message: "请选择日期", trigger: "blur" }], */
          limitMoney: [{
            required: true,
            message: "请输入满赠金额",
            trigger: "blur"
          }],
          activityDesc: [{
            required: true,
            message: "请输入活动说明",
            trigger: "blur"
          }],
          limitRate: [{
            required: true,
            message: "请输入概率系数",
            trigger: "blur"
          }],
        },
        disabledFlag: true,
        flag3: false
      };
    },
    mounted() {
       
      if (this.$route.params.status == 1) {
        //编辑页面;
        this.ruleForm = this.$route.params.row;

        this.value4.push(this.ruleForm.beginDate);
        this.value4.push(this.ruleForm.endDate);
        // this.$set(this,"value4",arr);
      }
      if (this.$route.params.status == 2) {
        //查看;
        this.ruleForm = this.$route.params.row;
        this.value4.push(this.ruleForm.beginDate);
        this.value4.push(this.ruleForm.endDate);
        this.flag3 = true;
      }
      if (this.$route.params.status == 3) {
        //新增
        this.disabledFlag = false;
      }
    },
    methods: {
      gaibianzhi() {
        console.log(this.value4);
        console.log("值改变");
      },
      goback() {
        this.$router.go("-1");
      },

      //保存
      submitForm(formName) {
         
        this.$refs[formName].validate((valid) => {
          if (this.value4.length == 0) {
            this.$message({
              message: '请选择时间',
              type: 'warning'
            });
            return false
          };

          if (this.ruleForm.limitMoney <= 0) {
            this.$message({
              message: '输入的满赠活动金额不能小于等于0',
              type: 'warning'
            });
            return false
          };
          if (this.ruleForm.limitRate < 0) {
            this.$message({
              message: '输入的概率系数不能小于0',
              type: 'warning'
            });
            return false
          };
          if (valid) {
            let data = {
              uuid: this.ruleForm.uuid ? this.ruleForm.uuid : null,
              activityName: this.ruleForm.activityName,
              beginDate: this.value4[0],
              endDate: this.value4[1],
              limitMoney: this.ruleForm.limitMoney,
              limitRate : this.ruleForm.limitRate,
              activityDesc: this.ruleForm.activityDesc,
              status: this.ruleForm.status,
            };
            addNewYearActivity(data).then(res => {
              if (res.code == 1) {
                this.$message({
                  message: '操作成功',
                  type: 'success'
                });
                this.$router.go("-1");
              } else {
                this.$message.error(res.message);
              }
            });
          } else {
            this.$message({
              message: '参数不完整，请查看提示',
              type: 'warning'
            });

            return false;
          }
        });
      },

      resetForm(formName) {
        this.$router.go("-1");
      }

    },

  }
</script>

<style lang="less" scoped>
  .adminSet {
    border: 1px solid #ebeef5;
    margin-left: 150px;
    padding: 50px 0px 20px 150px;
    width: 52%;
    position: relative;
  }

  .el-col-20 {
    border: 1px solid #ebeef5;
    margin-left: 150px;
    width: 60%;
  }

  .el-input {
    width: 60%;
  }

</style>
